<template>
  <van-picker
    title="选择性别"
    show-toolbar
    :columns="columns"
    :default-index="activeIndex" 
    @confirm="submit"
    @cancel="$emit('close')"
  />
</template>

<script>
import { updateUserInfo } from '@/api/user'
export default {
  data() {
    return {
      activeIndex:this.value, // 默认选中
      columns: ['男','女'] // 列的数据
    }
  },
  props:{
    value:{
      type:Number,
      require:true
    }
  },
  methods: {
    async submit(val,idx) {
      // val表示数据，idx表示索引
      console.log(val,idx);
      try {
        // 等待
        this.$toast.loading({
          message:'更新中',
          duration:0
        })
        // 发送请求
        await updateUserInfo({
          gender:idx
        })
        this.$toast.success('更新成功')
        this.$emit('input',idx) // 更新外面数据
        this.$emit('close') // 关闭
      } catch (error) {
        console.log(error);
        this.$toast.fail('更新失败')
      }
    }
  },
}
</script>

<style>
</style>